import React, { Component } from 'react';
import { NavLink, withRouter } from 'react-router-dom'
import Header from '../compents/Header'
import Footer from '../compents/Footer'
import { Input, Button } from 'antd';
import register from '../css/register.module.css'
import api from '../api/l_api'
class Register extends Component {
    constructor(props) {
        super(props)
        // console.log(props)
        this.state = {
            checked: true
        }
    }
    //注册
    register() {
        // console.log(this)
        let params = {
            userName: this.refs.ipt1.state.value,
            password: this.refs.ipt2.state.value
        }
        // console.log(params)
        if (this.state.checked === true) {
            // let _this = this
            api.register(params).then(data => {
                if (data.code === 'success') {
                    alert('注册成功')
                    localStorage.setItem('token', data.token)
                    this.props.history.push('./Login')
                } else {
                    alert(data.message)
                }
            })
        } else {
            alert('请同意下方协议')
        }

    }
    //选择
    dan() {
        let flag = this.state.checked
        flag = !flag
        if (flag === true) {
            this.setState({
                checked: true
            })
        }
        if (flag === false) {
            this.setState({
                checked: false
            })
        }

    }
    render() {
        return (
            <div>
                <Header />
                <div className={register.div}>
                    <div className={register.cont}>
                        <div>
                            <div>
                                <h2>注册</h2>
                            </div>
                            <div className={register.mima}>
                                <div>
                                    <p>账号</p>
                                    <Input placeholder="账号" ref="ipt1" />
                                </div>
                                <div>
                                    <p>密码</p>
                                    <Input placeholder="密码" ref="ipt2" />
                                </div>
                                <div>
                                    <Button type="primary" onClick={this.register.bind(this)}>注册</Button>
                                </div>
                            </div>
                        </div>
                        <div className={register.register}>
                            <input type="checkbox" checked={this.state.checked} onClick={this.dan.bind(this)} />
                            注册帐户即表示，您接受相关条款和条件以及隐私政策。
                        </div>
                        <div className={register.login}>
                            已有账号
                        <NavLink to="./Login">去登陆</NavLink>
                        </div>
                    </div>
                </div>
                <Footer />
            </div>
        )
    }
}
export default withRouter(Register)